<?xml version="1.0" encoding="UTF-8"?>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://xmlns.jcp.org/jsf/core">
    <h:head>
        <title>MeteoCal - Profile</title>
        <link type="text/css" rel="stylesheet" href="../resources/css/profile.css" />
    </h:head>
    <h:body>
        <div id="header"></div>
        <a href="homepage.xhtml?faces-redirect=true" ><img id="logo" src="../resources/images/logo.png"/></a> 
        <h:form id="formdock">
            <p:dock position="top" maxWidth="30" itemWidth="55">
                <p:menuitem  value="Invitations" action="#{invitationBean.retriveInvitation()}" icon="../resources/images/mail.png"/>
                <p:menuitem action="#{eventBean.tocreateEvent()}" value="New Event" icon="../resources/images/new.png"/>
                <p:menuitem value="Notifications" action="#{userBean.notifications()}" icon="../resources/images/Notification.png"/>
            </p:dock>
           <p:panelGrid id="panelSearch" styleClass="panelSearch" columns="2">
                <p:autoComplete styleClass="autoCompleteSearch" placeholder="Search"  id="themePojo" value="#{scheduleUserBean.selectedTheme}" completeMethod="#{autoCompleteView.completeTheme}"
                                var="theme" itemLabel="#{theme.name}" itemValue="#{theme}" forceSelection="true" converter="themeConverter"/>
                <p:commandButton icon="ui-icon-search" id="search" value="Search" action="#{scheduleUserBean.search()}"/>
                <h:link styleClass="advSearch" id="toolTipFade" value="Advanced search" outcome="/user/advsearch?faces-redirect=true"/>
            </p:panelGrid>
            <p:menuButton value ="Options"> 
                <p:menuitem value="Profile" action="#{userBean.goToProfile()}" icon="ui-icon-person"/>
                <p:menuitem value="Export Events" ajax="false" onclick="PrimeFaces.monitorDownload(start, stop);" icon="ui-icon-arrowthick-1-s" actionListener="#{scheduleBean.createCalendarIcs()}">
                    <p:fileDownload value="#{scheduleBean.export()}" />
                </p:menuitem>
                <p:menuitem value="Import Events" onclick="PF('importDialog').show();" icon="ui-icon-arrowthick-1-n"/>
                <p:separator/>
                <p:menuitem value="Logout" action="#{LoginBean.logout()}" icon="ui-icon-power"/>
            </p:menuButton>
        </h:form>
        
        <h:form enctype="multipart/form-data">
            <p:dialog  modal="true" widgetVar="importDialog" header="Import new events" draggable="false" closable="true" resizable="false">
                    <p:growl id="growl" showDetail="true" />
                    <p:fileUpload value="#{scheduleBean.fileUploaded}" mode="simple"/>
                    <p:commandButton ajax="false" actionListener="#{scheduleBean.upload()}" value="Upload" onclick="PrimeFaces.monitorDownload(start, stop);"/>  
            </p:dialog>
        </h:form>
        <h:form>
        <p:panel styleClass="panelBack" header="View Profile">
            <img class="imgPR" src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQP7DGq7uBcqvNh_XEVX-9mhEfp9jAN8QKFs0KBsSu8bqZeunbP" />
            <div class="pnlGrid">
                <p:panelGrid columns="2" columnClasses="column1,column2">
                    <h:outputText value="Name: " />
                    <h:outputText value="#{userBean.user.name}" />

                    <h:outputText value="Surname: " />
                    <h:outputText value="#{userBean.user.surname}" />

                    <h:outputText value="Email: " />
                    <h:outputText value="#{userBean.user.email}" />
                    
                    <h:outputText value="DOB: " />
                    <h:outputText value="#{userBean.user.dateOfBirth.getDate()}/#{userBean.user.dateOfBirth.getMonth()+1}/#{userBean.user.dateOfBirth.getYear()+1900}" />

                    <h:outputText value="Gender: " />
                    <h:outputText value="#{userBean.user.gender.equals('M') ? 'Male' : 'Female' }" />

                    <h:outputText value="Living Place: " />
                    <h:outputText value="#{userBean.user.livingPlace}" />
             </p:panelGrid>
            </div>
            <p:outputLabel styleClass="btn" value="Change visibility of your Calendar" />
            <p:selectBooleanButton onLabel="Public" offLabel="Private" styleClass="btn" value="#{userBean.user.idSchedule.public1}" />
            <p:commandButton styleClass="btn" value="Homepage" action="#{userBean.changeCalendar()}" />
        </p:panel>
            <script type="text/javascript">
                function start() {
                    PF('statusDialog').show();
                }

                function stop() {
                    PF('statusDialog').hide();
                }
            </script>
        </h:form>

    </h:body>
</html>

